import {View, Text, Button} from 'react-native';
import {useReducer} from 'react'; // 导入useReducer钩子

// 定义 Action 类型
type CounterAction =
  | {type: 'add'}
  | {type: 'sub'}
  | {type: 'add3'}
  | {type: 'addNum'; num: number};

//  1 定义reducer函数：接收当前状态和action，返回新状态
const reducer = (state: number, action: CounterAction): number => {
  switch (action.type) {
    case 'add':
      return state + 1; // 返回新状态：当前值+1
    case 'add3':
      return state + 3; // 返回新状态：当前值+3
    case 'addNum':
      return state + action.num; // 返回新状态：当前值+3
    case 'sub':
      return state - 1; // 返回新状态：当前值-1
    default:
      return state; // 处理默认情况
  }
};

export default function App() {
  // 2 使用useReducer初始化状态
  // res：当前状态值
  // dispatch：发送action的函数
  // reducer：状态更新逻辑
  // 0：初始状态值
  const [res, dispatch] = useReducer(reducer, 0);

  return (
    <View>
      {/* 3 使用  */}
      <Text>{res}</Text> {/* 显示当前状态 */}
      {/* 发送type为'add'的action，触发状态更新 */}
      <Button title="add" onPress={() => dispatch({type: 'add'})} />
      {/* 发送type为'sub'的action，触发状态更新 */}
      <Button title="sub" onPress={() => dispatch({type: 'sub'})} />
      {/* 点击一下 增加3  */}
      <Button title="add3" onPress={() => dispatch({type: 'add3'})} />
      {/* 点击一下 增加 任意数量  */}
      <Button
        title="addNum 10"
        onPress={() => dispatch({type: 'addNum', num: 10})}
      />
      <Button
        title="addNum 20"
        onPress={() => dispatch({type: 'addNum', num: 20})}
      />
    </View>
  );
}
